<!DOCTYPE html>
<html lang="en">
<head>
    <title>个人中心 {$site_info.site_name|default=''}</title>
    <meta name="keywords" content="{$site_info.site_seo_keywords|default=''}"/>
    <meta name="description" content="{$site_info.site_seo_description|default=''}">
    <include file="public@head"/>

    <link rel="stylesheet" href="__TMPL__/public/assets/css/dianjing/market_list.css" >

</head>
<body>
<div id="body" v-cloak>
    <div class="header">
        <a  href="javascript:void(0)" onclick="javascript:history.go(-1);return false;">
            <img src="__TMPL__/public/assets/images/dianjing/back.png" ></a>
        兑换记录
    </div>
    <div class="title">
        <ul id="toggle">
            <li class="cur">全部</li>
            <li>已兑换</li>
            <li>审核中</li>
        </ul>
    </div>
    <div class="list">
        <ul>
            <notempty name="data">
                <volist name="data" id="vo">
                    <li v-for="x in body">
                        <p style="height: 30px;line-height: 30px;font-size: 12px;color: #999">
                            <span>{:$vo.id}</span>
                            <span style="float: right">{:date('Y-m-d H:i:s',$vo['time'])}</span>
                        </p>
                        <div style="height: 80px;padding: 10px 0; overflow: hidden;">
                            <div style="width: 17%;float: left">
                                <img src="{:$vo.img}"  style="height: 60px;width: 100%; float: left">
                            </div>
                            <div style="width: 48%;float: left">
                                <p style="margin-bottom: 10px;color: #333;font-size: 14px;margin-left: 10px">{:$vo.name}</p>
                                <p style="color: #333;font-size: 14px;margin-left: 10px">x{:$vo.number}</p>
                            </div>
                            <div style="width: 35%;float: left;">
                                <p style="color: #333;margin-bottom: 20px;text-align: right;font-size: 14px">总计:{:$vo.all_price}</p>
                                <switch name="vo['status']">
                                    <case value="0">
                                        <p style="color: #333;text-align: right;font-size: 14px" >取消</p>
                                    </case>
                                    <case value="1">
                                        <p style="color: #333;text-align: right;font-size: 14px" >审核中</p>
                                    </case>
                                    <case value="2">
                                        <p style="color: #333;text-align: right;font-size: 14px" >已兑换</p>
                                    </case>
                                    <default/>
                                    <p style="color: #333;text-align: right;font-size: 14px" >已兑换</p>
                                </switch>
                            </div>
                        </div>
                    </li>
                </volist>
            </notempty>
        </ul>
    </div>
    <div class="list" style="display: none">
        <ul>
            <notempty name="data">
                <volist name="data" id="vo">
                    <switch name="vo['status']">
                        <case value="2">
                            <li v-for="x in body" v-if="x.status==1" :data-status="x.status">
                                <p style="height: 30px;line-height: 30px;font-size: 12px;color: #999">
                                    <span>{:$vo.id}</span>
                                    <span style="float: right">{:date('Y-m-d H:i:s',$vo['time'])}</span>
                                </p>
                                <div style="height: 80px;padding: 10px 0; overflow: hidden;">
                                    <div style="width: 17%;float: left">
                                        <img src="{:$vo.img}"  style="height: 60px;width: 100%; float: left">
                                    </div>
                                    <div style="width: 48%;float: left">
                                        <p style="margin-bottom: 20px;color: #333;font-size: 14px;margin-left: 10px">{:$vo.name}</p>
                                        <p style="color: #333;font-size: 14px;margin-left: 10px">x{:$vo.number}</p>
                                    </div>
                                    <div style="width: 35%;float: left;">
                                        <p style="color: #333;margin-bottom: 20px;text-align: right;font-size: 14px">总计:{:$vo.all_price}</p>
                                        <p style="color: #333;text-align: right;font-size: 14px">已兑换</p>
                                    </div>
                                </div>
                            </li>
                        </case>
                        <default/>

                    </switch>
                </volist>
            </notempty>
        </ul>
    </div>
    <div class="list" style="display: none">
        <ul>
            <notempty name="data">
                <volist name="data" id="vo">
                    <switch name="vo['status']">
                        <case value="1">
                            <li v-for="x in body" v-if="x.status==1" :data-status="x.status">
                                <p style="height: 30px;line-height: 30px;font-size: 12px;color: #999">
                                    <span>{:$vo.id}</span>
                                    <span style="float: right">{:date('Y-m-d H:i:s',$vo['time'])}</span>
                                </p>
                                <div style="height: 80px;padding: 10px 0; overflow: hidden;">
                                    <div style="width: 17%;float: left">
                                        <img src="{:$vo.img}"  style="height: 60px;width: 100%; float: left">
                                    </div>
                                    <div style="width: 48%;float: left">
                                        <p style="margin-bottom: 20px;color: #333;font-size: 14px;margin-left: 10px">{:$vo.name}</p>
                                        <p style="color: #333;font-size: 14px;margin-left: 10px">x{:$vo.number}</p>
                                    </div>
                                    <div style="width: 35%;float: left;">
                                        <p style="color: #333;margin-bottom: 20px;text-align: right;font-size: 14px">总计:{:$vo.all_price}</p>
                                        <p style="color: #333;text-align: right;font-size: 14px">已兑换</p>
                                    </div>
                                </div>
                            </li>
                        </case>
                        <default/>

                    </switch>
                </volist>
            </notempty>
        </ul>
    </div>
</div>
<script>
    $(document).ready(function () {
        var li   = $('#toggle').children();
        var list = $('.list');
        li.click(function () {
            li.removeClass('cur');
            $(this).addClass('cur');
            var id = li.index(this);
            list.css('display','none');
            list.eq(id).css('display','block')
        })
    })
</script>
</body>
</html>